import { FormType, IMyFormProps } from '@/base-ui/base-form/type'
import { ActionDesc } from '@/global/constant'
import { Button } from 'antd'
import React from 'react'

const myConfig: IMyFormProps = {
  desc: ActionDesc.UserSearch,
  layout: { span: 8 },
  formConfig: {
    name: 'wrap',
    // layout: 'inline',
    // 禁止整个表单操作
    // disabled: true,
    initialValues: {
      username1: '小明'
      // sex: ['aaa', 'male']
    },
    size: 'middle',
    labelAlign: 'right',
    // labelCol: 输入框这些前面的文字的宽度
    labelCol: { flex: '80px' },
    // labelWrap：表单前面的label宽度(labelCol指定的flex)不够,那么他会进行自动换行
    // labelWrap: true,
    // wrapperCol: { span: 12 },
    colon: false
    // style: { minWidth: 500 }
  },
  itemsConfig: [
    {
      type: FormType.Input,
      prop: 'username1', //必写的，唯一标识,因为name属性不一定全部都会有
      label: '用户名',
      name: 'username1',
      rules: [{ required: true }],
      input: {
        placeholder: '请输入用户名'
      }
    },
    {
      type: FormType.Password,
      prop: 'password1',
      label: '密码',
      name: 'password1',
      rules: [{ required: true }],
      input: {
        placeholder: '请输入密码'
      }
    },
    {
      type: FormType.TextArea,
      prop: 'password11',
      label: '多行输入框',
      name: 'password11',
      rules: [{ required: true }],
      textArea: {
        placeholder: '请输入内容',
        allowClear: true,
        disabled: true
      }
    },
    {
      type: FormType.Search,
      prop: 'password1221',
      label: '搜索框',
      name: 'password1221',
      rules: [{ required: true }],
      search: {
        placeholder: '请输入内容'
      }
    },
    {
      type: FormType.Select,
      prop: 'sex',
      label: '性别',
      name: 'sex',
      select: {
        baseProps: {
          placeholder: '性别',
          allowClear: true,
          // 下面还可以写一堆select自带的属性
          // disabled: true,
          loading: true,
          // showSearch: true,
          mode: 'tags',
          tokenSeparators: [','],
          size: 'small',
          placement: 'bottomLeft'
        },
        options: [
          { value: 'female', content: '女' },
          { value: 'male', content: '男' },
          { value: 'aaa', content: <Button>ni</Button> }
        ]
      }
    },
    {
      type: FormType.Custom,
      customkey: 'btn1',
      prop: 'btn1',
      label: '按钮1'
    },
    {
      type: FormType.Custom,
      customkey: 'ban',
      prop: 'ban',
      label: 'ban'
    }
  ]
}

export default myConfig
